<template>
  <div id="product">
    <ul>
      <li v-for="item of arrpvoid" :key="item.id">
        ID:{{ item.id }}---内容:{{ item.content }}---名称:{{ item.name }}---{{
          item.time
        }}---<button @click="remove(item)">删除</button>
      </li>
    </ul>
    <div>
      <h3>请输入用户名</h3>
      <input type="text" v-model="nickname" />
      <h3>请输入评论</h3>
      <textarea cols="30" rows="10" v-model="content"></textarea>
      <button @click="addData">添加</button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      arrpvoid: [],
      content: "",
      nickname: "",
    };
  },
  mounted() {
    // console.log(process.env.VUE_APP_BASEURL);
    this.requestData();
  },
  methods: {
    requestData() {
      this.$send({
        url: "/api/students/getstulist",
      }).then((res) => {
        if (res.data.state) {
          this.arrpvoid = res.data.data;
        }
      });
    },
    addData() {
      if (isNaN(!this.content) && isNaN(!this.nickname)) {
        console.log("请输入");
        return;
      }
      this.$send({
        url: "/api/students/addlist",
        method: "post",
        data: {
          content: this.content,
          name: this.nickname,
        },
        headers: {
          "Content-type": "application/json;charset=UTF-8",
        },
      }).then((res) => {
        this.content="";
        this.nickname="";
        console.log(res);
        this.requestData();
      });
    },
    remove(item) {
      this.$send({
        methods: "delete",
        url: "/api/students/del",
        params: {
          id: item.id,
        },
      }).then((res) => {
        console.log(res.data.msg);
        this.requestData();
      });
    },
  },
};
</script>

<style></style>
